<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
	<title>登录 - 洛师校友</title>
	<link rel="icon" href="favicon.ico" type="image/ico">
	<meta name="keywords" content="洛师校友">
	<meta name="description" content="洛师校友">
	<meta name="author" content="yinqi">
	<link href="/css/bootstrap.min.css" rel="stylesheet">
	<link href="/css/materialdesignicons.min.css" rel="stylesheet">
	<link rel="stylesheet" href="/js/jconfirm/jquery-confirm.min.css">
	<link href="/css/style.min.css" rel="stylesheet">
	<style>
		.lyear-wrapper {
			position: relative;
		}
		.lyear-login {
			display: flex !important;
			min-height: 100vh;
			align-items: center !important;
			justify-content: center !important;
		}
		.login-center {
			background: #fff;
			min-width: 38.25rem;
			padding: 2.14286em 3.57143em;
			border-radius: 5px;
			margin: 2.85714em 0;
		}
		.login-header {
			margin-bottom: 1.5rem !important;
		}
		.login-center .has-feedback.feedback-left .form-control {
			padding-left: 38px;
			padding-right: 12px;
		}
		.login-center .has-feedback.feedback-left .form-control-feedback {
			left: 0;
			right: auto;
			width: 38px;
			height: 38px;
			line-height: 38px;
			z-index: 4;
			color: #dcdcdc;
		}
		.login-center .has-feedback.feedback-left.row .form-control-feedback {
			left: 15px;
		}
	</style>
</head>

<body>
<div class="row lyear-wrapper">
	<div class="lyear-login">
		<div class="login-center">
			<div class="login-header text-center">
				<a href="bbs/bbs.html"> <img alt="light year admin" src="/images/logo-sidebar.png"> </a>
			</div>
			<form action="/login" id="login" method="post">
				<div class="form-group has-feedback feedback-left">
					<label for="username"></label><input type="text" placeholder="请输入您的用户名" class="form-control" name="username" id="username" onblur="checkUserName()"/>
					<span class="mdi mdi-account form-control-feedback" aria-hidden="true" ></span>
					<span id="checkUserName"></span>
				</div>
				<div class="form-group has-feedback feedback-left">
					<label for="password"></label><input type="password" placeholder="请输入密码" class="form-control" id="password" name="password" onblur="checkPassWord()"/>
					<span class="mdi mdi-lock form-control-feedback" aria-hidden="true" ></span>
					<span id="checkPassWord"></span>
				</div>

				<div class="form-group has-feedback feedback-left">
					<label class="lyear-checkbox checkbox-primary m-t-10">
						<input type="checkbox"  name="remember-me" value="on"><span>下次自动登录</span>
					</label>
				</div>

				<div class="form-group">
					<button class="btn btn-block btn-primary" type="button" onclick="login()">登录</button>
					<button class="btn btn-block btn-primary" type="button" onclick="register()">注册</button>
				</div>
			</form>
			<hr>
			<footer class="col-sm-12 text-center">
				<p class="m-b-0">Copyright © 2020 <a href="http://www.lynu.edu.cn/">洛阳师范学院</a>. All right reserved</p>
			</footer>
		</div>
	</div>
</div>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/axios.min.js"></script>
<script src="/js/jconfirm/jquery-confirm.min.js"></script>
<script type="text/javascript">

	function checkUserName() {
	    var username=$("#username").val();
	    if(username.trim()!=""){
            axios.get("/check/UserName?username="+username)
                .then(function (response) {
                    var data=response.data;
                    if(data==1){
                        $("#checkUserName").html("用户名正确")
                    }else {
                        $("#checkUserName").html("用户名错误")
                    }
                })
		}else {
            $("#checkUserName").html("用户名不能为空")
		}

    }

    function checkPassWord() {
        var password=$("#password").val();
        var username=$("#username").val();
        if(username.trim()!=""&&password.trim()!=""){
            axios.get("/check/PassWord?password="+password+"&username="+username)
                .then(function (response) {
                    var data=response.data;
                    if(data==1){
                        $("#checkPassWord").html("密码正确")
                    }else {
                        $("#checkPassWord").html("密码错误")
                    }
                })
		}else {
            $("#checkPassWord").html("密码不能为空")
		}

    }

	function login() {
        var password=$("#password").val();
        var username=$("#username").val();
        if(username.trim()!=""&&password.trim()!=""){
        axios.get("/check/PassWord?password="+password+"&username="+username)
            .then(function (response) {
                var data=response.data;
                if(data==1){
                    $("#login").submit();
                }else {
                    $.alert({
                        title: '登录',
                        content: '请再次检查账号密码是否正确',
                        buttons: {
                            confirm: {
                                text: '确认',
                                btnClass: 'btn-primary',
                            }
                        }
                    });
                }
            })
        }else {
            $.alert({
                title: '登录',
                content: '账号密码不能为空',
                buttons: {
                    confirm: {
                        text: '确认',
                        btnClass: 'btn-primary',
                    }
                }
            });
		}
    }

    function register() {
	    location.href="/register"
    }

</script>
</body>
</html>